<header class="flex items-center mb-6">
  <h1 class="crayons-title">Broadcasts</h1>
  <a href="<%= new_admin_broadcast_path %>" class="crayons-btn ml-auto" role="button">Make a New Broadcast</a>
</header>

<nav class="mb-2 flex justify-between items-center" aria-label="Broadcasts navigation">
  <ul class="crayons-navigation crayons-navigation--horizontal">
    <li>
      <%= link_to "All", admin_broadcasts_path, class: "crayons-navigation__item #{'crayons-navigation__item--current' if params[:type_of].blank?}" %>
    </li>
    <li>
      <%= link_to "Announcement", admin_broadcasts_path(type_of: :announcement), class: "crayons-navigation__item #{'crayons-navigation__item--current' if params[:type_of] == 'announcement'}" %>
    </li>
    <li>
      <%= link_to "Welcome", admin_broadcasts_path(type_of: :welcome), class: "crayons-navigation__item #{'crayons-navigation__item--current' if params[:type_of] == 'welcome'}" %>
    </li>
  </ul>
</nav>

<div class="crayons-card p-6 grid gap-6">
  <div class="crayons-notice crayons-notice--warning" aria-live="polite">
    <strong>Note: You must ensure that your Broadcast is active in order for it to be sent to users!</strong>
  </div>
  <table class="crayons-table">
    <thead>
      <tr>
        <th scope="col">Title</th>
        <th scope="col">Status</th>
      </tr>
    </thead>
    <tbody class="crayons-card">
      <% @broadcasts.each do |broadcast| %>
        <tr>
          <td><%= link_to broadcast.title, admin_broadcast_path(broadcast.id) %></td>
          <td class="justify-center">
            <div class="c-indicator c-indicator--<%= broadcast.active? ? "success" : "warning" %>">
              <%= broadcast.active? ? "Active" : "Inactive" %>
            </div>
          </td>
        </tr>
      <% end %>
    </tbody>
  </table>
</main>

<%= csrf_meta_tags %>
